<template>
	<view class="page-mynews page">
		<view class="form-container mb-30">
				<view class="form-item line-b">
					<view class="label" >充值金额<text class="c-ff6">*</text></view>
					<view class="right">
						<input type="number" placeholder="请输入" v-model="pic"/>
					</view>
				</view>
				
			<view class="pdtb-30 bg-f fz24 c-ff6 tac" @click="pay">充值</view>
		</view>
	</view>
</template>

<script>
	// import card from '../../components/card.vue'
	export default {
		data() {
			return {
				pic:'',
				uid:'',
				uinfo:'',
				openid:'',
			}
		},
		created() {
			let uid = uni.getStorageSync('uid')
			this.getuserinfo();
			console.log('312312');
		},
		methods: {
		async getuserinfo(){
			let data = {
				id:uni.getStorageSync('uid')
			}
			let res =  await this.$api.getuserinfo(data)
			console.log(res.data.code)
			if(res.data.code==0){
				this.uinfo = res.data.data
				this.uid = res.data.data.id
				this.openid  = res.data.data.openid
			}
		},
		//开始微信支付
				async pay() {
					let that = this
					var jweixin = require('jweixin-module');
							let data = {
								pic:this.pic,
								openid:this.openid,
								uid:this.uid
							}		
							let res = await this.$api.getpayinfodata(data)
						  let	data1 = {
							  pic:this.pic,
							  openid:this.openid,
							  uid:this.uid,
							  nonceStr:res.data.nonceStr,
							  paySign:res.data.paySign,
							  timeStamp:res.data.timeStamp,
							  package:res.data.package
						  }
						  console.log(data1);
							console.log(res);
							jweixin.config({
								debug: false, 
								appId:'wx92f28e9b99acb503',//必填
								jsApiList: ['chooseWXPay'] 
							});
							jweixin.ready(function() {
								jweixin.chooseWXPay({
								appId:res.data.appId,
								package: res.data.package,
								timestamp: res.data.timeStamp,
								nonceStr: res.data.nonceStr,
								signType: res.data.signType,
								paySign: res.data.paySign,								
									success: function(res) {
										// 支付成功后的回调函数
										uni.request({
										    url: 'https://xs.hephp.cn/api/Index/addczjl', //仅为示例，并非真实接口地址。
										    data: data1,
											header: {
												'Content-Type': 'application/json',
												'Content-Type': 'application/x-www-form-urlencoded',
											},
										    success: (res) => {
										   if(res.data.code==0){
												uni.navigateTo({
													url:'/pages/msglist/msglist'
												})
												// uni.showToast({
												// 	icon: 'none',
												// 	title: res.data.msg,
												// });
										   }else{
											   uni.showToast({
											   	icon: 'none',
											   	title: res.data.msg,
											   });
											}
										  }
										});
									},
									cancel: function(r) {},
									fail: function(res) {
										console.log('payfail')
									}
								});
							});
							jweixin.error(function(res) {
								uni.showToast({
									icon: 'none',
									title: '请到手机支付',
								});
							});
				},
				//添加支付记录
				async addjilu(){
					let data = {
						pic:this.pic,
						openid:this.openid,
						uid:this.uid
					}	
					let res = await this.$api.addjilu(data)
					if(res.data.code==0){
					// uni.navigateTo({
					// 	url:'/pages/msglist/msglist'
					// })
					uni.showToast({
						icon: 'none',
						title: res.data.msg,
					});
					}else{
				   uni.showToast({
					icon: 'none',
					title: res.data.msg,
				   });
				}
				},
					
		}
		// components: {
		// 	card
		// }
	}
</script>

<style lang="scss">
.page-mynews {
	background-color: #fff;
	.tab-item {
		flex:0 0 50%;
		text-align: center;
		padding: 20px 0;
		
		&.active {
			color: #f33333;
		}
	}
	.card-item {
		width: 100%;
		padding:20upx 25upx;
		background-color: #fff;
		border-radius: 10upx;
		margin-bottom: 10upx;
		image {
			width: 190upx;
			height: 126upx;
			margin-right: 34upx;
		}
	}
	.mag-left{
		margin-left: 40upx;
	}
}
</style>
